window.onload = function(){
    //配置
    var config = {
        vx: 4,//点x轴速度,正为右，负为左
        vy:  4,//点y轴速度
        height: 2,//点高宽，其实为正方形，所以不宜太大
        width: 2,
        count: 100,//点个数
        color: "100, 100, 100",//点颜色
        stroke: "50,50,50",//线条颜色
        dist: 6000,//点吸附距离
        e_dist: 20000,//鼠标吸附加速距离
        max_conn: 10//点到点最大连接数
    }
    //调用
    CanvasParticle(config,'MyDiv');
}


//点击右边导航栏跳到对应地方
function roll(){
    let lis=document.querySelectorAll("main .location li")
    let  li=document.querySelectorAll("main ul .particulars")
    let timeId=null
    let step=50
    lis.forEach((i,j) => {
        i.addEventListener("click",function(){
            if (timeId) {
                return
            }
            lis.forEach((k) => {
                k.classList.remove("active")
            });
            lis[j].classList.add("active")
           timeId= setInterval(() => {
                if (document.documentElement.scrollTop>li[j].offsetTop) {
                    document.documentElement.scrollTop-=step
                    if (Math.abs(document.documentElement.scrollTop-li[j].offsetTop)<=step) {
                        clearInterval(timeId)
                        timeId=null
                        document.documentElement.scrollTop=li[j].offsetTop
                    }
                }else{
                    document.documentElement.scrollTop+=step
                    if (Math.abs(document.documentElement.scrollTop-li[j].offsetTop)<=step) {
                        clearInterval(timeId)
                        timeId=null
                        document.documentElement.scrollTop=li[j].offsetTop
                    }
                }
            }, 30);
            
        })
    });
}
roll()